<toaster-container></toaster-container>
<div>
    <h3>Governance Reports</h3>
</div>
<hr>
<div class="row">
    <div class="col-md-3">
        Company:
    </div>
    <!-- START: search criteria  -->
    <div class="col-md-9">
        <div class="mb-3">
            <input type="text"
                class="form-control search-input"
                placeholder="Search Company"
                [(ngModel)]="term"
                (keyup)="search()"
                (focus)="found = searchResults && searchResults.length > 0"
                (blur)="focusOut($event)">

            <ul id="searchGroup" *ngIf="found" class="searchContainer">
                <li *ngFor="let elem of searchResults">
                    <a href="javascript:;" (click)="navigateToCompany(elem.id, elem.companyName)">{{elem.companyName}}</a>
                </li>
            </ul>
        </div>
    </div>
    <!-- END: search criteria  -->
</div>